//
import { useState } from 'react'

function Dog() {
    // [状态值，修改状态的方法]= useState（默认值） 值修改后，组件自动立即更新
    let [isBarking, setIsBarking] = useState(false)
    let [isRunning, setIsRunning] = useState(false)

    const handleClick = () => {
        // Dom 溜了，useState 太轻松了
        setIsBarking(true)
        setIsRunning(true)
        setTimeout(() => {
            setIsBarking(false)
            setIsRunning(false)
        }, 2000)
    }
    return (
        // 动态 多个状态 JSX
        <div onClick={handleClick}>
            <div>Dog</div>
            <p>{isBarking && '汪汪汪'}</p>
            <p>{ }</p>
        </div>
    )
}

export default Dog;